<template>
    <div class='dress'>
        <div class="dressnav">
            <van-nav-bar
                title="个性装扮"
                left-text=""
                left-arrow
                @click-left="onClickLeft"
                />
        </div>
        <div class="selfdomdress">
            <van-cell-group inset>
                <van-cell title="樱花粉" value="" label="猛男必备">
                <van-button round type="info" color="#CCCCCC" @click="change(1)">立即换肤</van-button>
                </van-cell>
            </van-cell-group>

             <van-cell-group inset>
                <van-cell title="高雅白" value="" label="简约">
                <van-button round type="info" color="#CCCCCC" @click="change(2)">立即换肤</van-button>
                </van-cell>
            </van-cell-group>

             <van-cell-group inset>
                <van-cell title="明亮绿" value="" label="轻快可爱">
                <van-button round type="info" color="#CCCCCC" @click="change(3)">立即换肤</van-button>
                </van-cell>
            </van-cell-group>

            <van-cell-group inset>
                <van-cell title="彩虹渐变" value="" label="别试">
                <van-button round type="info" color="#CCCCCC" @click="change(4)">立即换肤</van-button>
                </van-cell>
            </van-cell-group>

             <van-cell-group inset>
                <van-cell title="落日橘红" value="" label="深情不及落日">
                <van-button round type="info" color="#CCCCCC" @click="change(5)">立即换肤</van-button>
                </van-cell>
            </van-cell-group>

        </div>
    </div>
</template>

<script>
export default {
    
    data() {
        
        return {
            
        };
    },
    computed: {},
    watch: {},
    
    methods: {
        onClickLeft(){
            this.$router.go(-1);
        },
        change:function (type) {
            if(type == 1){
              document.getElementById('style').setAttribute("href","./one.css");
              localStorage.setItem("style","./one.css");
            }else if(type == 2){
              document.getElementById('style').setAttribute("href","./two.css");
              localStorage.setItem("style","./two.css");
            }else if(type == 3){
              document.getElementById('style').setAttribute("href","./three.css");
              localStorage.setItem("style","./three.css");
            }else if(type == 4){
              document.getElementById('style').setAttribute("href","./four.css");
              localStorage.setItem("style","./four.css");
            }else if(type == 5){
              document.getElementById('style').setAttribute("href","./five.css");
              localStorage.setItem("style","./five.css");
            }
          }
        
    },
    created() {
        
    },
    mounted() {
        
    },
    components: {},
    }
</script>
<style scoped>
    
</style>